<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="../principal.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://java.sun.com/jsp/jstl/core">
    <ui:define name="principal">
        <h2>Emitir Receituário</h2>
        
        <h:form id="breadcrumb">
            <p:breadCrumb styleClass="navegacao" style="margin-top: 5px; margin-bottom: 40px">  
                <c:if test="#{loginMB.dentista.contaUsuario.tipo == 'AD'}" >  
                    <p:menuitem value="Categories" url="../user-master/menuMaster.xhtml" />  
                </c:if>
                <c:if test="#{loginMB.dentista.contaUsuario.tipo == 'DE'}" >  
                    <p:menuitem value="Categories" url="../user-simple/menuDentista.xhtml" />  
                </c:if>
                <p:menuitem value="Relatórios" url="../dentista/gerenciarEmissoes.xhtml" />  
                <p:menuitem value="Receituário" url="../paciente/emitirReceituario.xhtml" />  
            </p:breadCrumb>
        </h:form>
        
        <h:form id="cad">
            <p:growl id="message"/>
            <p:fieldset legend="SELECIONE O PACIENTE" toggleable="true" toggleSpeed="500" styleClass="grupo-form">
                <h:panelGrid columns="2" styleClass="table-form" cellspacing="10">
                    <h:outputLabel for="paciente" value="*Paciente: " />
                    <h:panelGrid columns="2">
                        <p:inputText id="paciente" title="paciente" value="#{emitirReceituarioMB.pacienteSelecionado.nome} #{emitirReceituarioMB.pacienteSelecionado.sobrenome}" label="Nome" size="30" readonly="true" />
                        <p:commandButton onclick="pacienteDialog.show()" icon="ui-icon-search" type="button" update=":dialog:pacientes"/>
                    </h:panelGrid>
                </h:panelGrid>
            </p:fieldset>

            <p:fieldset legend="SELECIONE AS POSOLOGIAS" toggleable="true" toggleSpeed="500" styleClass="grupo-form">
                <h:panelGrid columns="1" styleClass="table-form" cellspacing="10">
                    <p:dataTable id="posologias" var="posologia" value="#{emitirReceituarioMB.listaPosologias}" style="width: 400px;" emptyMessage="Sem posologias">  
                        <p:column headerText="Posologias Selecionadas">
                            <h:graphicImage library="images" name="remedio.png"/>
                            <h:outputText value="  #{posologia.medicamento.nome} #{posologia.medicamento.concentracao}, #{posologia.quantidade}" />
                        </p:column>
                    </p:dataTable>
                    <p:commandButton id="selectButton" update=":dialog3:posologias-cadastradas, :dialog4:quantidade" onclick="posologiaDialog.show()" icon="ui-icon-plusthick" title="Adcionar" />  
                </h:panelGrid>
                <p:separator/>
                <h:panelGrid columns="3" styleClass="table-form" cellspacing="10">
                    <p:commandButton id="modalDialogButton" value="Novo Medicamento" onclick="novaPosologiaDlg.show();" icon="ui-icon-plus" type="button" style="width: 190px;"/>  
                </h:panelGrid>
            </p:fieldset>

            <p:fieldset legend="OBSERVAÇÃO" toggleable="true" toggleSpeed="500" styleClass="grupo-form">
                <h:panelGrid columns="2" styleClass="table-form" cellspacing="10">
                    <h:outputLabel for="obs" value="Observação: " />
                    <p:inputTextarea id="obs" value="#{emitirReceituarioMB.receituario.observacao}" label="Observação" cols="70" />
                </h:panelGrid>
            </p:fieldset>

            <h:panelGrid columns="1" style="text-align: right; width: 100%;">
                <p:commandButton value="Enviar" action="#{emitirReceituarioMB.emitirReceituario}" image="ui-icon ui-icon-disk" style="font-size: 15px;" ajax="false" />
            </h:panelGrid>

        </h:form>

        <h:form id="dialog">
            <p:dialog header="Pacientes Cadastrados" widgetVar="pacienteDialog" resizable="false" id="pacienteDlg" dynamic="true" 
                      showEffect="fade" hideEffect="fade" modal="true" width="500">
                <p:dataTable id="pacientes" var="paciente" value="#{emitirReceituarioMB.pacienteDataModel}" widgetVar="pacienteTable"
                             selection="#{emitirReceituarioMB.pacienteSelecionado}" selectionMode="single" emptyMessage="Sem pacientes cadastrados">

                    <p:ajax event="rowSelect" listener="#{emitirReceituarioMB.onRowSelect}"   
                            update=":cad:paciente" oncomplete="pacienteDialog.hide()" />

                    <f:facet name="header">  
                        Selecione um paciente para a construção do receituário  
                    </f:facet>

                    <p:column headerText="ID" filterBy="#{paciente.id}" filterMatchMode="contains" filterStyle="display:none;">  
                        #{paciente.id}  
                    </p:column>

                    <p:column headerText="NOME" filterBy="#{paciente.nome}" filterMatchMode="contains" filterStyle="display:none;">  
                        #{paciente.nome} #{paciente.sobrenome} 
                    </p:column>

                    <p:column headerText="CPF" filterBy="#{paciente.cpf}" filterMatchMode="contains" filterStyle="display:none;">  
                        #{paciente.cpf}  
                    </p:column>

                    <f:facet name="footer">  
                        <p:outputPanel style="float: right">  
                            <h:outputText value="BUSCAR: " />  
                            <p:inputText id="globalFilter" onkeyup="pacienteTable.filter()" style="width:200px" />  
                        </p:outputPanel> 
                    </f:facet>

                </p:dataTable>
            </p:dialog>
        </h:form>

        <h:form id="dialog2">
            <p:dialog id="novaPosologiaDialog" header="Novo Medicamento" widgetVar="novaPosologiaDlg" modal="true" showEffect="fade" hideEffect="fade" resizable="false">  
                <h:panelGrid id="novaposologia-display" columns="2" styleClass="table-form" cellspacing="10">
                    <h:outputLabel for="nome-pos" value="*Nome: " />  
                    <p:inputText id="nome-pos" value="#{emitirReceituarioMB.medicamentoCadastrar.nome}" required="true" label="Nome" size="40"/>
                    <h:outputLabel for="concentracao" value="*Concentração: " />  
                    <p:inputText id="concentracao" value="#{emitirReceituarioMB.medicamentoCadastrar.concentracao}" required="true" label="concentracao" size="30"/>
                    <h:outputLabel for="tipo" value="*Tipo de Uso: " />  
                    <p:inputText id="tipo" value="#{emitirReceituarioMB.medicamentoCadastrar.tipo_uso}" required="true" label="tipo" size="20"/>
                    <h:outputLabel for="via" value="*Via de Uso: " />  
                    <p:inputText id="via" value="#{emitirReceituarioMB.medicamentoCadastrar.via_uso}" required="true" label="via" size="20"/>
                    <h:outputLabel for="poso" value="*Posologia: " />  
                    <p:inputTextarea id="poso" value="#{emitirReceituarioMB.medicamentoCadastrar.posologia}" required="true" label="poso" cols="40" />
                </h:panelGrid>
                <p:commandButton value="Salvar" update=":cad:message, :dialog3:posologias-cadastradas, novaposologia-display" action="#{emitirReceituarioMB.cadastrarMedicamento}" image="ui-icon ui-icon-disk" style="float: right" oncomplete="novaPosologiaDlg.hide();"/>
            </p:dialog>
        </h:form>

        <h:form id="dialog3">
            <p:dialog header="Medicamentos Cadastrados" widgetVar="posologiaDialog" resizable="false" id="posologiaDlg" dynamic="true" 
                      showEffect="fade" hideEffect="fade" modal="true" width="500">
                <p:dataTable id="posologias-cadastradas" var="medicamento" value="#{emitirReceituarioMB.medicamentosTodos}" emptyMessage="Sem medicamentos cadastrados"
                             widgetVar="medicamentoTable" paginator="true" paginatorAlwaysVisible="false" rows="10" paginatorPosition="bottom">


                    <p:column style="width:4%">  
                        <p:rowToggler />  
                    </p:column>

                    <p:column headerText="DESCRIÇÃO" filterMatchMode="contains" filterBy="#{medicamento.nome}" filterStyle="display:none;">  
                        #{medicamento.nome} #{medicamento.concentracao}, #{medicamento.tipo_uso}, #{medicamento.via_uso}
                    </p:column>

                    <p:column style="width:40px">  
                        <p:commandButton id="selectButton2" update=":dialog4" oncomplete="quantMedDialog.show(); posologiaDialog.hide()" icon="ui-icon-check" title="Escolher">  
                            <f:setPropertyActionListener value="#{medicamento}" target="#{emitirReceituarioMB.medicamentoSelecionado}" />
                        </p:commandButton>
                    </p:column>

                    <p:rowExpansion>
                        <h:outputText value="POSOLOGIA:" /><br/>
                        <h:outputText value="#{medicamento.posologia}" />
                    </p:rowExpansion>

                    <f:facet name="footer">  
                        <p:outputPanel style="float: right">  
                            <h:outputText value="BUSCAR: " />  
                            <p:inputText id="globalFilter" onkeyup="medicamentoTable.filter()" style="width:200px" />  
                        </p:outputPanel> 
                    </f:facet>
                </p:dataTable>
            </p:dialog>
        </h:form>

        <h:form id="dialog4">
            <p:dialog header="Quantidade do Medicamento" widgetVar="quantMedDialog" resizable="false" id="quantMedDlg" dynamic="true" 
                      showEffect="fade" hideEffect="fade" modal="true" >
                <h:panelGrid id="quantidade-display" columns="1">
                    <h:outputLabel for="quantidade" value="*Quantidade: " />  
                    <p:inputText id="quantidade" value="#{emitirReceituarioMB.quantidade}" required="true" label="quantidade" size="30"/>
                </h:panelGrid>
                <p:commandButton value="Salvar" update=":cad:message, :cad:posologias" action="#{emitirReceituarioMB.adcionarPosologiaCadastro()}" image="ui-icon ui-icon-disk" style="float: right" oncomplete="quantMedDialog.hide();"/>
            </p:dialog>
        </h:form>

    </ui:define>
</ui:composition>